<!--
 * @Author: liaoyu1992 1519778181@qq.com
 * @Date: 2022-11-05 09:33:25
 * @LastEditors: liaoyu1992 1519778181@qq.com
 * @LastEditTime: 2022-11-11 22:02:48
 * @FilePath: \kgantt\core\components\other\StandardTooltipContent.vue
 * @Description: 
-->
<template>
  <div
    class="kgantt-tooltipDefaultContainer"
    :style="'font-size' + fontSize + ';font-family:' + fontFamily"
  >
    <b :style="'font-size:' + fontSize + 6">
      {{
        `${task.name}: ${task.start.getDate()}-${
          task.start.getMonth() + 1
        }-${task.start.getFullYear()} -
                        ${task.end.getDate()}-${
          task.end.getMonth() + 1
        }-${task.end.getFullYear()}`
      }}
    </b>
    <p
      v-if="task.end.getTime() - task.start.getTime() !== 0"
      class="kgantt-tooltipDefaultContainerParagraph"
    >
      {{
        `Duration: ${~~(
          (task.end.getTime() - task.start.getTime()) /
          (1000 * 60 * 60 * 24)
        )} day(s)`
      }}
    </p>
    <p class="kgantt-tooltipDefaultContainerParagraph">
      {{ !!task.progress && `Progress: ${task.progress} %` }}
    </p>
  </div>
</template>
<script lang="ts" setup>
defineProps({
  task: {
    type: Object,
    default: {},
  },
  fontSize: {
    type: String,
    default: "",
  },
  fontFamily: {
    type: String,
    default: "",
  },
});
</script>